<template>
  <view>
    <!-- #ifdef MP-WEIXIN -->
    <uv-navbar
      :fixed="false"
      :title="title"
      left-arrow
      @leftClick="$onClickLeft"
    />
    <!-- #endif -->
    <view>
      <uv-search
        margin="30rpx"
        v-model="keywork"
        :actionText="currentLanguageTexts.search"
        @custom="search(keywork)"
      ></uv-search>
    </view>
    <view v-for="(item, index) in list" :key="index">
      <uni-card
        :border="item.id == store.id"
        :title="item.name"
        :thumbnail="item.image"
        :thumb-width="80"
        :sub-title="item.status_text"
      >
        <view class="body" @click="choice(item)">
          <view>{{ currentLanguageTexts.distanceFrom }} {{ item.dis }}</view>
          <!-- <view v-if="item.distance > 0"
              >配送距离：{{ item.distance + 'km ' }} & 配送费：{{
                item.deliveryPrice
              }}</view
            >
            <view v-else>外卖不配送</view> -->
          <view>{{ (item.addressMap || '') + ' ' + item.address }}</view>
          <view
            >{{ currentLanguageTexts.businessHours }}：
            {{ formatDateTime(item.start_time, 'HH:mm') }} -
            {{ formatDateTime(item.end_time, 'HH:mm') }}</view
          >
        </view>
        <view class="footer">
          <uv-button @click="openLocation(item)">{{
            currentLanguageTexts.navigation
          }}</uv-button>
          <uv-button @click="call(item.mobile)">{{
            currentLanguageTexts.call
          }}</uv-button>
        </view>
      </uni-card>
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue';
import { useMainStore } from '@/store/store';
import { storeToRefs } from 'pinia';
import { onLoad, onShow, onPullDownRefresh, onHide } from '@dcloudio/uni-app';
import { formatDateTime, kmUnit, prePage } from '@/utils/util';
import { shopNearby, menuGoods } from '@/api/goods';
import { DoGetShopList, DoGetShopDistance } from '@/api/due';
const main = useMainStore();
const { store, location, currentLanguageTexts } = storeToRefs(main);
const title = ref(currentLanguageTexts.value.shopnames);
const list = ref([]);
const keywork = ref('');
const page = ref(1);
const pagesize = ref(10);
const type = ref(1);

onLoad((option) => {
  type.value = option.type;
  uni.getLocation({
    type: 'wgs84',
    success: function (res) {
      const result = {
        latitude: res.latitude,
        longitude: res.longitude,
      };
      main.SET_LOCATION(result);
      getShop();
    },
    fail: function (res) {
      uni.showToast({
        title: currentLanguageTexts.value.failedLocation,
        duration: 2000,
        icon: 'error',
      });
      // 默认地为你为北京地址
      const result = {
        latitude: 39.91999,
        longitude: 116.45627,
      };
      main.SET_LOCATION(result);
      getShop();
    },
    complete: function (res) {},
  });
});

const getShop = async (keywork = '') => {
  let data = await DoGetShopList({
    lat: location.value.latitude ? location.value.latitude : 0,
    lng: location.value.longitude ? location.value.longitude : 0,
    kw: keywork,
    shop_id: 0,
  });
  list.value = data?.list || [];
  list.value.forEach(async (item) => {
    await DoGetShopDistance({
      lat: location.value.latitude ? location.value.latitude : 0,
      lng: location.value.longitude ? location.value.longitude : 0,
      shop_id: item.id,
    }).then((data) => {
      item.dis = data.dis || 0;
    });
  });
};
//打开定位
const openLocation = (shop) => {
  //console.log(shop);
  uni.openLocation({
    latitude: parseFloat(shop.lat),
    longitude: parseFloat(shop.lng),
    name: shop.name,
    address: shop.address,
    fail: (res) => {},
  });
};
// 打电话
const call = (mobile) => {
  uni.makePhoneCall({
    phoneNumber: mobile,
  });
};
// 搜索按钮
const search = (keywork) => {
  page.value = 1;
  getShop(keywork);
};
// 选中店铺
const choice = (shop) => {
  main.SET_STORE(shop);
  uni.$emit('refreshMenu');
  if (type.value == 1) {
    uni.switchTab({
      url: '/pages/menu/menu',
      success(res) {},
      fail(res) {},
    });
  } else {
    uni.navigateTo({
      url: '/pages/components/pages/due/index',
    });
  }
};
</script>

<style lang="scss" scoped>
.body {
  view {
    margin-bottom: 10rpx;
  }
}
.u-border {
  border: 1rpx solid #1296db;
}
</style>
